<template>
  <el-tooltip
    class="box-item"
    :effect="effect"
    :content="content"
    :enterable="enterable"
    :show-after="showAfter"
    placement="top"
  >
    <slot />
  </el-tooltip>
</template>
<script setup lang="ts">
defineProps({
  content: {
    type: String,
    default: '你好世界'
  },
  effect: {
    type: String,
    default: 'dark',
    validator(value:string) {
      // The value must match one of these strings
      return ['dark', 'light'].includes(value)
    }
  },
  enterable: {
    type: Boolean,
    default: false
  },
  showAfter: {
    type: Number,
    default: 300
  }
})
</script>
